<template>
  <div>
    
    <div class="hezi">
      <div>
        <el-autocomplete v-model="state" placeholder="请输入内容"></el-autocomplete>
      </div>

      <div>
        <el-date-picker
          v-model="value2"
          type="datetimerange"
          :picker-options="pickerOptions"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          align="right"
        ></el-date-picker>
      </div>

      <div>
        <el-input placeholder="入住人数未定" suffix-icon="el-icon-user-solid" v-model="input1"></el-input>
      </div>

      <div>
        <el-button type="primary">查看价格</el-button>
      </div>
    </div>



  </div>
</template>

<script>
export default {
  data() {
    return {
      state: "南京市", //输入框 限制南京
      input1: "", //监听入住人数
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            }
          }
        ]
      },
      value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
      value2: ""
    };
  },

  methods: {
    //   鼠标按下
    renyuan() {
      console.log(123456);
    }
  }
};
</script>

<style lang="less" scoped>
.hezi {
  display: flex;
  justify-content: space-between;
  div {
    margin-right: 10px;
  }
}
</style>